<!doctype html>
<html lang="en">
<head>
	<meta charset="UTF-8">
	<title>js</title>
</head>
<body>
	<h1>00001</h1>
	<h1>00002</h1>
	<h1>00003</h1>
	<h1>00004</h1>
	<h1>00005</h1>
	

</body>

<script>
	objs=document.getElementsByTagName('h1');
	for(i=0; i<objs.length;i++){
		//alert(i);//读取alert(i);没有读取alert(0); 因为函数onmouseenter没有被触发，没有执行，变量不能解析，所以i为5。
		objs[i].onmouseenter=function(){

			this.style.background='#ccc';
			//objs[i].style.background='#ccc';
			//报错	Cannot read property 'style' of undefined 意思为style前边的objs未定义， objs[i] 是5
			//出现问题原因：执行顺序的原因, objs[5]不存在。所以报错。alert(i) 先执行是5。后执行鼠标移入时，objs[i]早已经是5了。objs[5]不存在，只有0，1，2，3，4 所以报错为未定义。
			//##事件不触发，函数不执行
			//注意：for循环中，凡是有事件，事件里边有函数，函数里边的变量要多加小心，此时的变量会出错，用this代替。除非变量与循环无关，则可以使用。
		}

		objs[i].onmouseleave=function(){
			this.style.background='#fff';
			
		}
	}

</script>
</html>